<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc." />
    <meta name="author" content="haijun.liu" />
    <title>APK列表</title>
    <link th:href="@{/images/favicon_1.ico}" rel="shortcut icon">
    <link  rel="stylesheet" type="text/css"  th:href="@{/plugins/sweetalert/dist/sweetalert.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/plugins/morris.js/morris.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap.min.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap-table.css}"  />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap-dialog.css}"  />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/datepicker.css}"/>
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/core.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/icons.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/components.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/pages.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/menu.css}" />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/responsive.css}"  />
    <link  rel="stylesheet" type="text/css"  th:href="@{/css/fileinput.css}"  />
    <link  rel="stylesheet" type="text/css"  th:href="@{/themes/explorer-fa/theme.css}"  />

    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/plugins/sortable.js}"></script>
    <script th:src="@{/js/fileinput.js}"></script>
    <script th:src="@{/js/locales/fr.js}"></script>
    <script th:src="@{/js/locales/es.js}"></script>
    <script th:src="@{/themes/explorer-fa/theme.js}"></script>
    <script th:src="@{/themes/fa/theme.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/bootstrap-table.js}"></script>
    <script th:src="@{/js/bootstrap-table-zh-CN.js}"></script>
    <script th:src="@{/js/bootstrap-dialog.js}"></script>
    <script th:src="@{/js/bootstrap-datepicker.js}"></script>
    <script th:src="@{/js/app.js}"></script>
    <script th:src="@{/js/modernizr.min.js}"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript">

        $(function(){
            //datepicker
            $(".date-picker,.input-daterange,.datepicker-disabled-past,.datepicker-inline").datepicker({
                todayHighlight: !0,
                autoclose: !0
            })
            /*bootstrap table*/
            $('#table').bootstrapTable({
                url:"/app/app/getApkList",//请求数据url
                queryParams: function (params) {
                    return {
                        offset: params.offset,  //页码
                        limit: params.limit,   //页面大小
                        search : params.search, //搜索
                        order : params.order, //排序
                        ordername : params.sort, //排序
                    };
                },
                toolbar:"#toolbar",
                checkboxHeader: true,
                clickToSelect:true,
                showHeader : true,
                showColumns : true,
                showRefresh : true,
                pagination: true,//分页
                sidePagination : 'server',//服务器端分页
                pageNumber : 1,
                pageList: [10, 15, 20],//分页步进值
                search: true,//显示搜索框
                //表格的列 data-checkbox="true"
                columns: [
                    {
                        field: '全选',
                        title: '全选',
                        checkbox:true
                    },
                    {
                        field: 'id',//域值
                        title: '编号',//标题
                        visible: true,//false表示不显示
                        width : '5%',
                    },
                    {
                        field: 'version',//域值
                        title: '版本',//内容
                        visible: true,//false表示不显示
                        width : '10%',
                        editable:true,
                    },
                    {
                        field: 'verno',//域值
                        title: '版本号',//内容
                        visible: true,//false表示不显示
                        width : '10%',
                        editable:true,
                    },
                    {
                        field: 'apkUrl',//域值
                        title: '包地址',//内容
                        visible: true,//false表示不显示
                        width : '30%',
                        editable:true,
                        formatter: function (value, row) {
                            var downloadUrl = row.apkUrl;
                            console.log("downloadUrl : " + downloadUrl);
                            var ahref = '<a href="'+ downloadUrl +'">【点击下载】</a>';
                            return ahref;
                        }
                    },
                    {
                        field: 'appStoreId',//域值
                        title: '苹果商城编码',//内容
                        visible: true,//false表示不显示
                        width : '10%',
                        editable:true,
                    },
                    {
                        field: 'content',//域值
                        title: '版本说明',//内容
                        visible: true,//false表示不显示
                        width : '10%',
                        editable:true,
                    },
                    {
                        field: 'isUpdate',//域值
                        title: '是否更新',//内容
                        visible: true,//false表示不显示
                        width : '10%',
                        editable:true,
                        formatter : function (value, row, index) {
                            if (value == 0 ) {
                                return '不更新';
                            }else if (value == 1){
                                return '更新';
                            }
                        }
                    },
                    {
                        field: 'createTime',//域值
                        title: '创建时间',//内容
                        visible: true,//false表示不显示
                        width : '20%',
                        editable:true,
                    }
                ],
                queryParams: function(params) {
                    var data = $('#queryForm').serializeObject();
                    var temp = {
                        limit: params.limit,    //页面大小
                        offset: params.offset,
                        sort: params.sort,    //排序列名
                        order: params.order,
                        userId: params.userId,
                        typeId: data.typeId,
                        isRecoHot: data.isRecoHot,
                        status: data.status,
                        operType: data.operType
                    };
                    return temp;
                }
            });

            /**
             * 查询
             */
            $('#btn_query').click(function () {
                data =  $('#queryForm').serializeObject();
                $('#table').bootstrapTable('refresh', {
                    query: data
                });
            });

            /**
             * @description：添加apk
             * @version 1.0
             * @author: Yang.Chang
             * @email: cy880708@163.com
             * @date: 2018/3/6 下午1:41
             * @mofified By:
             */
            $('#btn_add').click(function () {
                $("#modal").on("hidden.bs.modal", function() {
                    $(this).removeData("bs.modal");
                });
                $("#modal").modal({
                    remote: "/app/app/apk_add"
                });
            });

            /**
             * @description：删除apk
             * @version 1.0
             * @author: Yang.Chang
             * @email: cy880708@163.com
             * @date: 2018/3/6 下午1:41
             * @mofified By:
             */
            $('#btn_del').click(function () {
                // 1 获取选择的行
                var sels = $('#table').bootstrapTable('getAllSelections');
                if(sels.length <1){
                    // 如果没有选中的记录，则弹出提示框，提示"请选择要修改的记录"
                    showAlert("请选择要删除的记录", function () {
                        return ;
                    })
                }else if (sels.length >= 1){
                    // 2 弹出确认对话框
                    showConfirm('确定要删除？', function () {
                        var ids = [];
                        var sels = $('#table').bootstrapTable('getAllSelections');
                        // 2 判断是否有选中的行
                        if (sels.length > 0){
                            $.each(sels, function(i, value) {
                                ids.push(value.id);
                            });
                            // 3 向后台发送ajax请求进行删除
                            var options = {
                                url: '/app/app/deleteApk',
                                type: 'post',
                                dataType: 'json',
                                data: {
                                    ids:ids.join(',')
                                } ,
                                success: function (data) {
                                    // 4 删除成功后弹出成功提示框，并且刷新表格
                                    if (data){
                                        showAlert('删除成功!',function () {
                                            $('#table').bootstrapTable('refresh', {silent: true})
                                        });
                                    }
                                }
                            };
                            $.ajax(options);
                        }
                    }, function () {
                        return ;
                    });
                }
            });
        });
    </script>
</head>
<body class="fixed-left">
    <div id="toolbar">
        <p>
            <button id="btn_add" type="button" class="btn btn-success">添加</button>
            <button id="btn_del" type="button" class="btn btn-danger">删除</button>
        </p>
    </div>
<table id="table"></table>
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        </div>
    </div>
</div>
</body>
</html>